<!DOCTYPE  html>
<html>
<head>
<meta  http-equiv="Content-Type" content="text/html;  charset=UTF-8">
<meta http-equiv="X-UA-Compatible"  content="IE=edge,chrome=1">
<title>gubhugreyot....</title>
<!-- 
http://markitup.jaysalvat.com/examples/

font -- Berylium - flamingtext.com 

http://www4.flamingtext.com/net-fu/dynamic.cgi?script=outline-shadow-logo&textBox=&text=[audio]&fontsize=14&fontname=Berylium&textAdvanced=&textBorder=5&growSize=0&antialias=on&hinting=on&justify=2&letterSpacing=0&lineSpacing=0&textSlant=0&textVerticalSlant=0&textAngle=0&textFilters=&textOutline=false&textOutlineSize=2&textFiltersEnd=&textAdvancedEnd=&textBoxEnd=&logoBox=&colorTextR=0&colorTextG=0&colorTextB=0&outlineSize=1&colorOutlineR=0&colorOutlineG=0&colorOutlineB=0&logoBoxEnd=&shadowBox=&shadowType=1&shadowXOffset=2&shadowYOffset=2&shadowBlur=4&colorShadowR=0&colorShadowG=0&colorShadowB=0&shadowOpacity=100&reflectOpacity=50&reflectTiltX=0&reflectPercent=66&reflectScaleYPercent=100&reflectXOffset=0&reflectYOffset=0&colorShadowGlowR=0&colorShadowGlowG=0&colorShadowGlowB=255&shadowGlowSize=2&shadowGlowFeather=5&colorShadowNormalR=60&colorShadowNormalG=60&colorShadowNormalB=60&shadowNormalFeather=2&shadowNormalOpacity=50&shadowNormalTiltX=40&shadowNormalScaleYPercent=65&shadowNormalXOffset=0&shadowNormalYOffset=0&shadowBoxEnd=&backgroundBox=&backgroundResizeToLayers=on&backgroundRadio=0&colorBackgroundR=255&colorBackgroundG=255&colorBackgroundB=255&backgroundPattern=Wood&backgroundGradient=Full+saturation+spectrum+CCW&colorStarburstColorAltR=237&colorStarburstColorAltG=36&colorStarburstColorAltB=0&colorStarburstColor1R=189&colorStarburstColor1G=36&colorStarburstColor1B=9&backgroundStarburstNum=25&backgroundStarburstRayPercentage=50&backgroundStarburstAdvancedGroup=&backgroundStarburstUseColor2=on&colorStarburstColor2R=0&colorStarburstColor2G=0&colorStarburstColor2B=0&backgroundStarburstOffsetAngle=0&backgroundStarburstXOffset=0&backgroundStarburstYOffset=0&backgroundStarburstCenterPercentage=2&backgroundStarburstRadiusX=300&backgroundStarburstRadiusY=300&backgroundStarburstAdvancedGroupEnd=&backgroundBoxEnd=&imageSizeBox=&useAutoSize=on&imageWidth=400&imageHeight=150&imageSizeAdvancedGroup=&imageAlignment=4&imageSizeAdvancedGroupEnd=&imageSizeBoxEnd=&ext=png&jpgQuality=85&


<script type="text/javascript" src="http://markitup.jaysalvat.com/_scripts/jquery.pack.js"></script>
<script type="text/javascript" src="http://markitup.jaysalvat.com/examples/markitup/jquery.markitup.js"></script>
<script type="text/javascript" src="http://markitup.jaysalvat.com/examples/markitup/sets/html/set.js"></script>

-->
<script type="text/javascript" src="https://gr-blogtools.googlecode.com/svn/js/jquery-1.3.2.obus.js"></script>
<script type="text/javascript" src="markitup/jquery.markitup.js"></script>
<script type="text/javascript" src="markitup/set-test.js"></script>
<script src="http://jscolor.com/example/jscolor/jscolor.js" type="text/javascript"></script>
<style>

input#colors{
    padding-left:10px;
    width:60px;
    height:16px;
    font-family:Arial;
    position:absolute;
    top:34px;
    cursor:hand;
    cursor:pointer;
    right:17px;
    border:none;
    border-radius:6px 2px 2px 0;
}
input#colors:focus,input#colors:active{
    padding-left:10px;
    width:64%;
    height:66px;
    font-family:Arial;
    position:absolute;
    top:34px;
    right:322px;
    border:none;
    border-radius:6px 2px 2px 4px;
    z-index:9999999;
}
input#colors:focus{
    cursor:text;
    text-align:right;
    padding-right:20px;
    font-size:30px;
}
</style>
</head>
<body>

<script type="text/javascript" >
$(document).ready(function()	{
	$('#html').markItUp(myHtmlSettings);
	
	$('#tabs').tabs();
});
</script>



<div class="ook" style="position:relative;">
<input id="colors" title="Click and get it your colors!" value="#26FFF8" class="color {hash:true,pickerPosition:'right',pickerFace:4,pickerBorderColor:'#000000',pickerBorder:5,
pickerFaceColor:'#444444'}"/>
<textarea id="html" cols="80" rows="20">
</textarea>
</div>
<link rel="stylesheet" type="text/css" href="http://markitup.jaysalvat.com/examples/markitup/skins/markitup/style.css" />
<link rel="stylesheet" type="text/css" href="http://markitup.jaysalvat.com/examples/markitup/sets/html/style.css" />

<style>
html,body{padding:10px 0;}
body{position:relative;margin:10px auto;}
.html .markItUp  {
	width:997px;
	margin:5px 0 5px 0;margin:10px auto;
	border:5px solid #F5F5F5;border:1px solid #000;border-radius:10px;box-shadow:0 0 8px #000;	
}
.markItUpContainer  {
	border:3px solid #d1a998;border-top-width:8px;	
	background:#fff/* url(http://markitup.jaysalvat.com/examples/markitup/skins/markitup/images/bg-container.png) repeat-x top left */;
background:#fff url(https://lh6.googleusercontent.com/-bMz1ZLFz96k/UGA9soynC6I/AAAAAAAAAA4/UJI7xjNsBeo/s500/bg_grad-H1x500.png) repeat-x  left 28px;
	padding:5px;
	font:11px Verdana, Arial, Helvetica, sans-serif;
border-radius:3px 3px 8px 8px;
}
.markItUpEditor {
	font:12px 'Courier New', Courier, monospace;
	padding:5px 5px 5px 5px;
	border:3px solid #3C769D;
	width:970px;width:98.5%;
        min-width:70%;
        max-width:98.5%;
	height:200px;
border-radius:8px 8px 0 0;
background:none;
	background:#FFF/* url(http://markitup.jaysalvat.com/examples/markitup/skins/markitup/images/bg-editor.png) no-repeat*/;
	clear:both;
	line-height:18px;
	overflow:auto;
}
.markItUpPreviewFrame	{
	overflow:auto;
	background-color:#FFFFFF;
	border:1px solid #3C769D;
	width:99.9%;
	height:500px;
}
.html .markItUpEditor{
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/skins/markitup/images/bg-editor-html.png);
        background-image:none;
}
.markItUp{padding-top:25px;background:#fff url(https://lh6.googleusercontent.com/-bMz1ZLFz96k/UGA9soynC6I/AAAAAAAAAA4/UJI7xjNsBeo/s500/bg_grad-H1x500.png) repeat-x  left top;}
.html{background:blue;padding:20px 5px;}

.markItUpHeader ul{background:#fff;background:rgba(215,215,215,0.2);box-shadow:0 0 2px #555;
margin:0 0 20px 0;padding:1px;min-height:18px;}

/* -------------------------------------------------------------------
// markItUp!
// By Jay Salvat - http://markitup.jaysalvat.com/
// ------------------------------------------------------------------*/
/*
.html .markItUpButton1 a {
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/html/images/h1.png); 
}
.html .markItUpButton2 a {
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/html/images/h2.png); 
}
.html .markItUpButton3 a {
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/html/images/h3.png); 
}
.html .markItUpButton4 a {
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/html/images/h4.png); 
}
.html .markItUpButton5 a {
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/html/images/h5.png); 
}
.html .markItUpButton6 a {
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/html/images/h6.png); 
}
*/

.markItUpContainer .markItUpHeader ul li a{padding:2px 0 2px 1px;height:14px;}
.markItUpContainer .markItUpHeader ul li a:hover{background-color:rgba(255,0,0,0.2);}
.markItUpContainer .markItUpHeader ul li a:focus{background-color:rgba(255,0,0,0.6);}
/* 
https://lh4.googleusercontent.com/-_g99tEsQT2o/UGNzkV8z9pI/AAAAAAAAAKs/U4faVFa0UyY/h120/h1_V18.png 
https://lh4.googleusercontent.com/-GoDTr33X5og/UGNzk4L94GI/AAAAAAAAAKw/JDOYExYs1ec/h120/h2_V18.png
https://lh4.googleusercontent.com/-MnQQFN_H-pM/UGNzlqT6BHI/AAAAAAAAAK4/yAlefEFghuI/h120/h3_V18.png
https://lh3.googleusercontent.com/-3YWU2w8ca5I/UGNzmAtz45I/AAAAAAAAAK8/jshCZOztjuQ/h120/h4_V18.png
https://lh3.googleusercontent.com/--AvITORMY9c/UGNzmyD0WEI/AAAAAAAAALE/yfsou23OYHk/h120/h5_V18.png
https://lh5.googleusercontent.com/-fPzt4U6Tlq4/UGNzndE4K_I/AAAAAAAAALQ/yU2kZtlRdDU/h120/h6_V18.png
width:28px;
*/
.html .markItUpButton a{
	background-image:none; 
}
.html .markItUpButton1 {width:120px;
	background-image:url(markitup/images/h1-h6gr.png); 
}
.html .markItUpButton1 a {width:17px;margin-left:4px
	
}
.html .markItUpButton2 a {/*width:28px;*/width:18px;margin-left:-98px;
	background-image:url(); 
}
.html .markItUpButton3 a {width:18px;margin-left:-78px;
	background-image:url();

}
.html .markItUpButton4 a {width:16px;margin-left:-58px;
	background-image:url();

}
.html .markItUpButton5 a {width:16px;
	background-image:url(); margin-left:-40px;
}
.html .markItUpButton6 a {width:16px;
	background-image:url(); margin-left:-20px;margin-right:8px;
}



.html .markItUpButton7 {background-image:none;width:180px;
	background-image:url(markitup/images/div-uH180V18.png); 
}/* DIV */
.html .markItUpButton7 a {width:17px;margin-left:7px
	
} /* p */
.html .markItUpButton8 a {/*width:14px;*/width:10px;margin-left:-154px;
	background-image:url(); 
}/* b */
.html .markItUpButton9 a {width:11px;margin-left:-143px;
	background-image:url();
}/* STRONG */
.html .markItUpButton10 a {width:40px;margin-left:-128px;
	background-image:url();
}/* I */
.html .markItUpButton11 a {width:14px;
	background-image:url(); margin-left:-86px;
} /* em */
.html .markItUpButton12 a {width:18px;
	background-image:url(); margin-left:-72px;
} /* U */
.html .markItUpButton13 a {width:12px;
	background-image:url(); margin-left:-52px;
} /* SPAN */
.html .markItUpButton14 a {width:27px;
	background-image:url(); margin-left:-34px;
}
.html .markItUpButton14{
	margin-right:8px;
}


.html .markItUpButton15 {background-image:none;width:65px;
	background-image:url(markitup/images/class-idH65V18.png); 
}/* CLASS */
.html .markItUpButton15 a {width:32px;margin-left:7px
	
} /* ID */
.html .markItUpButton16 a {width:14px;margin-left:-20px;
	background-image:url(); 
}

.html .markItUpButton16{
	margin-right:8px;
}




/* strike */
.html .markItUpButton17 a {width:27px;
	background-image:url(https://lh5.googleusercontent.com/-JIyMA_9eoA4/UGNYsTMYMOI/AAAAAAAAAIA/abOjWyTj8jM/h120/strike_V18.png);
}
/* ol https://lh4.googleusercontent.com/-5H0gmqm5tRQ/UGNfMFRsEeI/AAAAAAAAAIo/mBfyYx1bV8o/h120/ol_V18.png*/
.html .markItUpButton18 a { width:18px;
	background-image:url(markitup/images/nums-list.png);
}
/* ul */
.html .markItUpButton19 a { width:18px;/*https://lh5.googleusercontent.com/-jzPUW9AZT2g/UGNfK2LW0wI/AAAAAAAAAIk/p67-myDfYRE/h120/ul_V18.png http://markitup.jaysalvat.com/examples/markitup/sets/html/images/list-bullet.png */
	background-image:url(markitup/images/bullet-list.png);
}
/* li https://lh4.googleusercontent.com/-zVnrjZRtm4k/UGNgaxGZ-WI/AAAAAAAAAJA/_RUhIItNYak/h120/li_V18.png */
.html .markItUpButton20 a {width:20px;
	background-image:url(markitup/images/list.png);
}

/* image */
.html .markItUpButton21 a { width:20px;
	background-image:url(https://lh6.googleusercontent.com/-szONWWQdETo/UGNdFoEENrI/AAAAAAAAAIY/WFF3E20j2CY/h120/img_V18.png);
}
/* link */
.html .markItUpButton22 a {width:28px;
	background-image:url(https://lh5.googleusercontent.com/-uxVfPZNpBow/UGNjEUa8cmI/AAAAAAAAAJQ/yT5FfIj6lF8/h120/link_V18.png);
}
/* blockquote */
.html .markItUpButton23 a {width:14px;
	background-image:url(https://lh6.googleusercontent.com/-t4w7b-zpaqc/UGNkvpDwPMI/AAAAAAAAAJY/dht2y847kys/h120/blockquote_V18.png);
}



.html .markItUpButton24 {width:162px;
	background-image:url(markitup/images/pre-hr.png); 
}
/* PRE */
.html .markItUpButton24 a {width:24px;margin-left:4px
	
} /* CODE */
.html .markItUpButton25 a {width:28px;margin-left:-130px;
	background-image:url(); 
}/* clear : both  */
.html .markItUpButton26 a {width:40px;margin-left:-97px;
	background-image:url();
} /* hr */
.html .markItUpButton27 a {width:22px;margin-left:-53px
	
} /* br */
.html .markItUpButton28 a {width:21px;margin-left:-29px;
	background-image:url(); 
}


/* HTML - CSS - js */
.html .markItUpButton29 {width:84px;
	background-image:url(markitup/images/html-css-js.png); 
}
.html .markItUpButton29 a {width:30px;margin-left:4px
	
}
.html .markItUpButton30 a {/*width:22px;*/width:21px;margin-left:-42px;
	background-image:url(); 
}
.html .markItUpButton31 a {width:10px;margin-left:-18px;
	background-image:url();
}


/* decode */
.html .markItUpButton32 a {width:22px;
	background-image:url(https://lh4.googleusercontent.com/-2BIYrNoiiW8/UGN_svoSpMI/AAAAAAAAAM8/fNEWONDzUd4/h120/html_V18.png);
}
/* decode */
.html .markItUpButton33 a {
margin-left:2px;width:20px;
}
.html .markItUpButton34 a {
margin-left:2px;width:20px;
}


/* PREVIEW http://markitup.jaysalvat.com/examples/markitup/sets/html/images/preview.png */
.html .preview a{width:64px;
	background-image:url(https://lh4.googleusercontent.com/-O9tVAZw75lk/UGNuY2RxFAI/AAAAAAAAAKE/XF2B6qNUU-M/h101/preview_V18.png);
}









.html .markItUpButton33  a {
	background-image:url(images/colors.png);
}
	.html .markItUpButton33 ul {
		width:40px;
		padding:1px;	
	}
	.html .markItUpButton33  li {
		border:1px solid white;
		width:35px;	height:20px;
		overflow:hidden;
		padding:0px; margin:0px;
		float:left;
	}
	.html .markItUpButton33 ul a {text-align:center;
		width:35px;	height:20px;
	}
	.html .markItUpButton33 ul a:hover {
		background-color:none;
	}
	
	.html .markItUpButton33 .oon1 a {
		background:yellow;
	}
	.html .markItUpButton33 .oon2 a {
		background:orange;
	}
	.html .markItUpButton33 .oon3 a {
		background:red;
	}
	
	.html .markItUpButton33 .oon4 a {
		background:blue;
	}
	.html .markItUpButton33 .oon5 a {
		background:purple;
	}
	.html .markItUpButton33 .oon6 a {
		background:green;
	}





.html .markItUpButton34  a {
	background-image:url(images/colors.png);
}
	.html .markItUpButton34 ul {
		width:81px;
		padding:1px;	
	}
	.html .markItUpButton34  li {
		border:1px solid white;
		width:25px;	height:25px;
		overflow:hidden;
		padding:0px; margin:0px;
		float:left;
	}
	.html .markItUpButton34 ul a {
		width:25px;	height:25px;
	}
	.html .markItUpButton34 ul a:hover {
		background-color:none;
	}
	
	.html .markItUpButton34 .col1-1 a {
		background:yellow;
	}
	.html .markItUpButton34 .col1-2 a {
		background:orange;
	}
	.html .markItUpButton34 .col1-3 a {
		background:red;
	}
	
	.html .markItUpButton34 .col2-1 a {
		background:blue;
	}
	.html .markItUpButton34 .col2-2 a {
		background:purple;
	}
	.html .markItUpButton34 .col2-3 a {
		background:green;
	}
	
	.html .markItUpButton34 .col3-1 a {
		background:white;
	}
	.html .markItUpButton34 .col3-2 a {
		background:gray;
	}
	.html .markItUpButton34 .col3-3 a {
		background:black;
	}
















.markItUpHeader ul .markItUpSeparator {
	margin:2px 2px;
	width:1px;
	height:12px;
	overflow:hidden;
	background-color:#555;box-shadow:2px 2px 2px #555;
}

/*.markItUpContainer .markItUpHeader ul{position:relative;}*/


/*
.markItUpHeader ul li.markItUpButton1{width:120px;}
.markItUpHeader ul li.markItUpButton2,
.markItUpHeader ul li.markItUpButton3,
.markItUpHeader ul li.markItUpButton4,
.markItUpHeader ul li.markItUpButton5,
.markItUpHeader ul li.markItUpButton6{display:block;position:absolute;padding:0;}
.markItUpHeader ul li.markItUpButton2{left:25px;}
.markItUpHeader ul li.markItUpButton3{left:45px;}
.markItUpHeader ul li.markItUpButton4{left:60px;}
.markItUpHeader ul li.markItUpButton5{left:75px;}
.markItUpHeader ul li.markItUpButton6{left:90px;}



.markItUpContainer .markItUpHeader ul li.markItUpButton2:hover{top:-4px;z-index:12;padding:0 3px;margin-left:-5px;background:#eee;}
.markItUpContainer .markItUpHeader ul li.markItUpButton3:hover{top:-4px;z-index:13;padding:0 3px;margin-left:-5px;background:#eee;}
.markItUpContainer .markItUpHeader ul li.markItUpButton4:hover{top:-4px;z-index:14;padding:0 3px;margin-left:-5px;background:#eee;}
.markItUpContainer .markItUpHeader ul li.markItUpButton5:hover{top:-4px;z-index:15;padding:0 3px;margin-left:-5px;background:#eee;}
.markItUpContainer .markItUpHeader ul li.markItUpButton6:hover{top:-4px;z-index:16;padding:0 3px;margin-left:-5px;background:#eee;}
 .markItUpContainer .markItUpHeader ul li.markItUpButton1,.markItUpContainer 

.html .markItUpButton17 a	{
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/markdown/images/quotes.png);
}
.html .markItUpButton18 a	{
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/markdown/images/code.png);
}
.html .markItUpButton19 a	{
	background-image:url(http://markitup.jaysalvat.com/examples/markitup/sets/html/images/clean.png);
}
*/
</style>
<!--<link rel="stylesheet" type="text/css" href="http://markitup.jaysalvat.com/examples/markitup/sets/markdown/style.css" />-->
</body>
</html>